import { Column } from '@/components/pro-panel/index.typing';
import { LayerTypeEnum } from './index';

export const useWaterColumns = (changeLayerType: Function) => {
  /**
   * 水体效果
   */
  const waterColumns = computed<Column[]>(() => {
    /** 基础设置 */
    const basicColumns: Column[] = [
      {
        type: 'select',
        prop: 'layerType',
        label: '图层类型',
        group: 'basic',
        options: LayerTypeEnum,
        formProps: {
          onChange: changeLayerType,
        },
      },
      {
        type: 'select',
        prop: 'heightKey',
        label: '离地高度',
        group: 'basic',
        options: [],
        span: 11,
        formProps: {
          placeholder: '无/按字段',
        },
      },
      {
        type: 'slot',
        prop: 'addIconSlot',
        label: ' ',
        group: 'basic',
        span: 2,
      },
      {
        type: 'input-number',
        prop: 'heightValue',
        label: ' ',
        group: 'basic',
        span: 11,
        formProps: {
          controls: false,
        },
      },
    ];

    /** 填充效果 */
    const fillEffectColumns: Column[] = [
      {
        type: 'color-picker',
        prop: 'baseWaterColor',
        label: '基本颜色',
        group: 'fillEffect',
      },
      {
        type: 'color-picker',
        prop: 'blendColor',
        label: '叠加颜色',
        group: 'fillEffect',
      },
      {
        type: 'progress-input',
        prop: 'alpha',
        label: '透明度',
        group: 'fillEffect',
        formProps: {
          min: 0,
          max: 1,
          step: 0.01,
        },
      },
      {
        type: 'progress-input',
        prop: 'frequency',
        label: '波纹数量',
        group: 'fillEffect',
        formProps: {
          min: 0,
          max: 20,
          step: 1,
        },
      },
      {
        type: 'progress-input',
        prop: 'animationSpeed',
        label: '水流速度',
        group: 'fillEffect',
        formProps: {
          min: 0,
          max: 20,
          step: 1,
        },
      },
      {
        type: 'progress-input',
        prop: 'angle',
        label: '水流方向',
        group: 'fillEffect',
        formProps: {
          min: -360,
          max: 360,
          step: 0.01,
        },
      },
      {
        type: 'progress-input',
        prop: 'amplitude',
        label: '振动幅度',
        group: 'fillEffect',
        formProps: {
          min: 0,
          max: 1,
          step: 0.01,
        },
      },
      {
        type: 'input',
        prop: 'u_frequency',
        label: 'UV缩放',
        group: 'fillEffect',
        span: 12,
      },
      {
        type: 'input',
        prop: 'v_frequency',
        group: 'fillEffect',
        label: ' ',
        span: 12,
      },
      {
        type: 'progress-input',
        prop: 'specularIntensity',
        label: '反射度',
        group: 'fillEffect',
        formProps: {
          min: 0,
          max: 10,
          step: 0.01,
        },
      },
      {
        type: 'progress-input',
        prop: 'refractIntensity',
        label: '折射度',
        group: 'fillEffect',
        formProps: {
          min: 0,
          max: 10,
          step: 0.01,
        },
      },
    ];

    return [
      {
        type: 'input',
        prop: 'name',
        label: '名称',
        required: true,
        rules: [{ required: true, message: '名称不能为空' }],
      },
      ...basicColumns,
      ...fillEffectColumns,
    ];
  });

  return {
    waterColumns,
  };
};
